<template>
	<div>
		<h2>连续签到天数</h2>

		<el-button-group v-for="(item,index) in dateList" :key="index">
			<!-- v-text="item" -->
			<el-button :type="item > this.entity.consecutiveSignInDays ? '':'primary'" v-text="item" plain ></el-button>
		</el-button-group>
		<p></p>
		<el-button type="primary" @click="doSignIn" :disabled="disabledClick">签到</el-button>

		<p>当前积分:{{entity.score}}</p>
		<el-button type="primary" @click="showIntegralRecord()" round>查看积分记录</el-button>
	</div>
</template>

<script>
	// import qs from 'qs'
	import localstorage from '@/utils/localstorage.js'
	import {
		ElMessageBox,
		// ElMessage,
	} from 'element-plus'


	export default {
		name: "SignIn",
		data() { //数据
			return {
				//是否已经签到, true为已签到,false为未签到
				isSignIn: '', 
				disabledClick:false,
				dateList: [1],
				entity: {
					consecutiveSignInDays:'',
				},
			}
		},
		beforeMount() { //挂载之前
			this.checkSignIn();
			this.getSignInRecordByUserId();
			this.days() //生成天数
		},
		mouted() { //挂载之后
			
		},
		updated() { //更新之后
		
			// this.getSignInRecordByUserId();
		},
		methods: {
			//获取签到记录信息
			getSignInRecordByUserId() {
				//获取本地存储的uid,
				let userId = localstorage.get('uid');
				console.log("userId=" + userId);
				// this.entity.id = this.$route.query.id;
				this.$axios.get('/api/signInRecord/getSignInRecordInfoByUserId', {
						params: {
							// userId: this.entity.id
						}
					})
					.then(data => {
						//将响应结果数据赋值给 user对象
						this.entity = data.entity;
						console.log("this.entity.consecutiveSignInDays="+this.entity.consecutiveSignInDays)
					}).catch(error => {
						console.log("error:" + error)
					})
			},
			// 签到规则:
			// 1.1天只能 签到一次，
			// 2.当天签后这个按钮不可用
			// 3.签到送积分规则：第一天送一个积分， 第二天送两个积分， 第三天送三个积分依次灰推，直到连续签到15天，
			// 第十六天开始也只是送十五个积分。如果中途中断了签名，则从头开始计算。
			// 这些送积分信息也是不能写死在代码里，需要能够灵活配置。
			checkSignIn(){
				//先判断今天是否已经签到
				this.$axios.get('/api/signInRecord/checkSignIn')
					.then(res => {
						//未签到
						if(!res.data==true){
							this.disabledClick = false;
							this.entity = res.entity;
							
							
						}else{
							// this.disabledClick = true;
						}
						console.log("this.isSignIn="+this.isSignIn)
					}).catch(error => {
						console.log("error:" + error);
						return;
					})
			},
			doSignIn() {
				//先判断今天是否已经签到
				this.$axios.get('/api/signInRecord/checkSignIn')
					.then(res => {
						//如果是未签到,执行签到操作
						if(!res.data==true){
							
							//未签到
							this.$axios.post('/api/signInRecord/update')
								.then(res => {
									console.log("res=" + res);
									//查询更新后的用户信息
									this.$axios.get('/api/signInRecord/getSignInRecordInfoByUserId')
										.then(res => {
											this.entity = res.entity
											//弹窗提示已签到
											ElMessageBox.alert('您已经连续签到' + this.entity.consecutiveSignInDays + '天, 本次签到奖励' + this.entity
													.consecutiveSignInDays + '个积分', '签到成功', {
														confirmButtonText: 'OK',
													})
												.then(({
													value
												}) => {
													// let signIn = qs.stringify(this.entity);
													// // console.log("let signIn.id=" + signIn.id)
													// console.log("let signIn.consecutiveSignInDays=" + signIn.consecutiveSignInDays)
													console.log("value=" + value)
													this.disabledClick = true;
													location.reload();
												}).catch(error => {
													console.log("error:" + error)
												})
												//更新完数据后刷新页面
												// location.reload();
										}).catch(error => {
											console.log("error:" + error);
											return;
										})
									
									
								}).catch(error => {
									console.log("error:" + error);
									return;
								})
							
							
						}else{
							//已签到
							ElMessageBox.alert('您今天已经签到过了', '提示信息', {
								confirmButtonText: 'OK',
							})
							// this.disabledClick = true;
						}
						console.log("this.isSignIn="+this.isSignIn)
					}).catch(error => {
						console.log("error:" + error);
						return;
					})
				// //如果未签到
				// if (!this.isSignIn) {
					
				// }else{//已签到
					
					
				// }
				
			},
			showIntegralRecord(){
				this.$router.push('/integralRecord')
			},
			days() {
				//创建一个1-30的数组
				// console.log(Array.from({
				// 	length: 30
				// }, (_, i) => 1 + (i)));
				//赋值给数组
				this.dateList = Array.from({
					length: 30
				}, (_, i) => 1 + (i));
				//  
			},


		}


	}
</script>

<style scoped>

</style>
